<template>
    <a-card title="添加商品">
        <GoodsForm ref="formRef" v-model:value="formState"></GoodsForm>

        <div class="bottom-div">
            <a-space>
                <a-button @click="save" :loading="loading" size="large" type="primary">保存</a-button>
                <a-button @click="close" size="large">取消</a-button>
            </a-space>
        </div>
    </a-card>
</template>
<script setup lang="ts">
import { onActivated, ref } from 'vue'

import { useRouter } from "vue-router"
import { useTabStore } from '@/stores/tab'
import type { Goods } from '@/types/Goods'

import { postGoods } from '@/api/goodsApi'
import { message } from 'ant-design-vue'
import { useGoodsStore } from '@/stores/goods'
import GoodsForm from './goodsForm.vue'
import { amapGeo } from '@/api/amapApi'
import dayjs from 'dayjs'

const goodsStore = useGoodsStore()
const tabStore = useTabStore()
const router = useRouter()
const formState = ref<Goods>({})
const formRef = ref()
const loading = ref(false)

const save = async () => {
    loading.value = true


    try {
        await formRef.value.validate()
        formState.value.price = formState.value.price! * 100
        let res = await postGoods(formState.value)

        message.success('新增成功')
        goodsStore.reloadList = true
        formState.value = {}
        formRef.value.resetFields()
        close()

    } catch (error) {

    }
    loading.value = false

}

const close = () => {
    router.back()
    tabStore.removeTab(router.currentRoute.value.fullPath)

}
onActivated(() => {


    formState.value.createTime = dayjs().format('YYYY-MM-DD HH:mm:ss')


})

</script>
<style scoped>
.bottom-div {
    padding: 30px 0;
    text-align: center;
}
</style>